<template>
	<view  @touchstart="handleTouchstart" @touchend="handleTouchend">
		<slot></slot>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 按下的时间
				StartTime: 0,
				// 坐标
				startX: 0,
				startY:0
				
			};
		},
		methods:{
			handleTouchstart(event){
				this.StartTime = Date.now();
				this.startX = event.changedTouches[0].clientX;
				this.startY = event.changedTouches[0].clientY;
			},
			handleTouchend(event){
				const endTime = Date.now();
				const endX = event.changedTouches[0].clientX;
				const endY = event.changedTouches[0].clientY;
				if(endTime - this.StartTime >2000){
					return;
				}
				
				let direction = ''
				
				if(Math.abs(endX - this.startX) > 10 && Math.abs(endY - this.startY) < 10) {
					direction = endX - this.startX > 10 ? 'right' : 'left';
				} else {
					return;
				}
				
				// console.log(direction);
				this.$emit('swiperaction',{direction});
			}
		}
	}
	
</script>

<style>
</style>
